<!--
 * @Author: xiaotiwen
 * @Date: 2020-05-21 14:58:24
 * @LastEditTime: 2020-05-21 15:10:06
 * @LastEditors: xiaotiwen
 * @FilePath: \eduweb\src\views\practiceManagement\scheduleSetting\panelPart.vue
 * @Description: 排课片段组件
-->

<template>
    <div class="panelPart">
        <h2 class="panelPart_titles">排课</h2>
        <div class="panelPart_body">
            <el-row class="panelPart_row">
                <el-col :span="10">
                    <el-select v-model="data.number1" :disabled="true">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
                    </el-select>
                    <span>~</span>
                    <el-select v-model="data.number2" :disabled="true">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
                    </el-select>
                </el-col>
                <el-col :span="6">
                    <el-radio-group v-model="data.radio" :disabled="true">
                        <el-radio :label="1">单周</el-radio>
                        <el-radio :label="2">双周</el-radio>
                        <el-radio :label="3">连续周</el-radio>
                    </el-radio-group>
                </el-col>
            </el-row>
            <el-table :data="data1">
                <el-table-column :label="item.label" :prop="item.props" :min-width="item.width" v-for="item in label1" :key="item.props"></el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
export default {
    // 组件名称
    name: 'panelPart',
    // 局部注册的组件
    components: {},
    // 组件参数 接收来自父组件的数据
    props: {},
    // 组件状态值
    data() {
        return {
            data: {
                number1: '3',
                number2: '4',
                radio: 1
            },
            data1: [
                { names: '星期一1-8星期二1-8星期三1-8星期四1-8星期五1-8星期六1-8', close: '机械学院', children: [{ name: '哈哈', number: 10000 }, { name: '哈哈', number: 10000 }], number: 9999, status: 1, btnFlag: true },
                { names: '星期一1-8星期二1-8星期三1-8星期四1-8星期五1-8星期六1-8', close: '机械学院', children: [{ name: '哈哈', number: 10000 }, { name: '哈哈', number: 99999 }], number: 8888, status: 2, btnFlag: false },
                { names: '星期一1-8星期二1-8星期三1-8星期四1-8星期五1-8星期六1-8', close: '机械学院', children: [{ name: '哈哈', number: 10000 }, { name: '哈哈', number: 99999 }], number: 8888, status: 3, btnFlag: false },
                { names: '星期一1-8星期二1-8星期三1-8星期四1-8星期五1-8星期六1-8', close: '机械学院', children: [{ name: '哈哈', number: 10000 }, { name: '哈哈', number: 99999 }], number: 9999, status: 4, btnFlag: false },
                { names: '星期一1-8星期二1-8星期三1-8星期四1-8星期五1-8星期六1-8', close: '机械学院', children: [{ name: '哈哈', number: 10000 }, { name: '哈哈', number: 99999 }], number: 8888, status: 5, btnFlag: false }
            ],
            label1: [
                { label: '占用周', props: 'number', width: '100' },
                { label: '教室', props: 'number', width: '100' },
                { label: '节次', props: 'names', width: '500' },
            ]
        };
    },
    // 计算属性
    computed: {},
    // 侦听器
    watch: {},
    /**
    * 在实例初始化之后，组件属性计算之前，如data属性等
    */
    created() {
    },
    /**
    * 在挂载开始之前被调用：相关的 render 函数首次被调用。
    */
    mounted() {
    },
    // 组件方法
    methods: {}
};
</script>
<style lang="scss" scoped>
.panelPart {
    background-color: #fff;
    padding: 20px 0;
    &_titles {
        padding: 0 40px 20px;
        border-bottom: solid #ccc 1px;
    }
    &_body {
        padding: 0 20px;
    }
    &_row {
        display: flex;
        align-items: center;
        padding-bottom: 20px;
    }
}
</style>

